﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
    <meta name='apple-itunes-app' content='app-id=1024484466'>
    <title>web页面跳转App</title>

</head>
<body>

<style type="text/css">
    body {
        margin: 0;
    }

    .block .tl {
        line-height: 40px;
        padding-left: 30px;
    }

    .item {
        width: 100%;
        height: 80px;
        background-color: red;
        display: block;
        margin-bottom: 20px;
    }
</style>

<div class="web_to_app">

    <div class="block">

        <div class="tl">微信</div>

        <div class="jump_type">

            <a class="item" href="weixin://">
                1.a标签 href跳转
            </a>

            <div class="item" onclick="goWxByLocation()">
                2.window.location跳转
            </div>

            <div class="item" onclick="goWxByIframe()">
                3.iframe跳转
            </div>

        </div>

    </div>

    <div class="block">

        <div class="tl">百度贴吧</div>

        <div class="jump_type">

            <div class="item" onclick="goTbByLocation()">
                1.window.location跳转
            </div>

        </div>

    </div>

    <div class="block">

        <div class="tl">乐游宝</div>

        <div class="jump_type">

            <!--<div class="item" onclick="window.location= 'https://itunes.apple.com/cn/app/id1024484466';">-->
            <!--乐游宝 div 直接跳转ios应用商店下载-->
            <!--</div>-->

            <div class="item" onclick="goLeyoobaoByLocation()">
                1.window.location跳转
            </div>

            <div class="item"
                 onclick='window.open("http://a.app.qq.com/o/simple.jsp?pkgname=com.travel.maintab&g_f=991653");'>
                乐游宝 div window.open
            </div>

        </div>

    </div>

</div>


<script>

    //微信 window.location跳转
    var goWxByLocation = function () {
        window.location = 'weixin://';
    };

    //微信 iframe跳转
    var goWxByIframe = function () {

        // 通过iframe的方式试图打开APP，如果能正常打开，会直接切换到APP，并自动阻止js其他行为
        var ifr = document.createElement('iframe');
        ifr.src = 'weixin://';//打开app的协议，有app同事提供
        ifr.style.display = 'none';
        document.body.appendChild(ifr);
        window.setTimeout(function () {
            document.body.removeChild(ifr);
            alert("跳转到微信的下载页");
        }, 2000)

    };

    //百度贴吧 window.location跳转
    //百度贴吧 在ios上的下载页不能直接跳过去，有问题，没解决？？？？？
    var goTbByLocation = function () {

        //ios
        if (navigator.userAgent.match(/(iPhone|iPod|iPad);?/i)) {
            alert("ios_1");
            window.location = "com.baidu.tieba://";//ios app协议
            window.setTimeout(function () {
                alert("ios_没安装,进入下载页。");
                window.location = "https://itunes.apple.com/cn/app/id477927812";
            }, 2000);
        }
        //andorid
        else if (navigator.userAgent.match(/android/i)) {
            window.location = "com.baidu.tieba://app";//android app协议
            window.setTimeout(function () {

                alert("android_没安装，进入下载页。");
//                window.location.href = "https://****.apk";//android 下载地址
            }, 3000);
        }
        else {
            alert("无法识别类型！")
        }

    };

    //乐游宝 window.location跳转
    var goLeyoobaoByLocation = function () {

        //ios
        if (navigator.userAgent.match(/(iPhone|iPod|iPad);?/i)) {
            alert("ios_1");
            window.location = "leyoobao://";//ios app协议
            window.setTimeout(function () {
                alert("ios_没安装,进入下载页。");
                window.location = "https://itunes.apple.com/cn/app/id1024484466";
            }, 2000);
        }
        //andorid
        else if (navigator.userAgent.match(/android/i)) {
            window.location.href = "laofan://com.travel.maintab";
            window.setTimeout(function () {
                window.location = "http://download.leyoobao.com/";
            }, 3000);
        }
        else {
            alert("无法识别类型！");
        }

    };


</script>

</body>
</html>
